<template>
	<view>
		<navComponent :options="options" @SEL="selectSEL"></navComponent>
		<myMovie :List="movieList"></myMovie>
	</view>
</template>

<script>
	import navComponent from '../../components/nav_component/nav_component.vue'
	import myMovie from '../../components/my_movie/my_movie.vue'
	export default {
		data() {
			return {
				options: [],
				movieList: [],
				sel: 0,
				total: 0,
				isLoading: false,

				queryObj: {
					classify: '全部',
					limit: 10,
					page: 1
				}
			};
		},

		onLoad() {
			this.getOption()

			this.getMovieList()
		},

		onReachBottom() {
			if (this.queryObj.limit * this.queryObj.page >= this.total) return uni.showToast({
				title: '数据已经空啦',
				icon: 'success'
			})
			if (this.isLoading) return

			this.queryObj.page += 1
			this.getMovieList() 
		},

		onPullDownRefresh() {
			this.queryObj.page = 1
			this.movieList = []
			this.total = 0
			this.isLoading = false
			this.getMovieList(() => {
				uni.stopPullDownRefresh()
			})
		},

		components: {
			navComponent,
			myMovie
		},
		methods: {
			async getOption() {
				const {
					data: res
				} = await this.$myRequest({
					url: `/my/options?classify=电影`
				})
				this.options = res.data
				for (var i = 0; i < this.options.length; i++) {
					this.options[i].id = i + 1
				}
			},

			async getMovieList(cb) {
				this.isLoading = true
				uni.showLoading({
					title: '数据加载中'
				})
				const {
					data: res
				} = await this.$myRequest({
					url: '/my/movie/getmovie',
					data: this.queryObj
				})
				uni.hideLoading()
				this.movieList = [...this.movieList, ...res.data]
				this.total = res.total
				this.isLoading = false
				cb && cb()
			},

			selectSEL(val) {
				this.sel = val
				for (let i = 0; i < this.options.length; i++) {
					if (this.sel == this.options[i].id) {
						this.queryObj.classify = this.options[i].classify
						this.queryObj.page = 1
						this.movieList = []
						this.getMovieList()
						break
					}
					if (this.sel == 0) {
						this.queryObj.classify = '全部'
						this.queryObj.page = 1
						this.movieList = []
						this.getMovieList()
						break
					}
				}
			}
		}
	}
</script>

<style lang="scss">

</style>
